import React, {Component} from 'react';
import {Icon, Avatar} from 'weaver-mobile';
import { withRouter } from 'react-router-dom';

@withRouter
export default class Leaf extends Component{
    render(){
        const {node} = this.props;
        const {id, nodeType, haschild, lv, name, icon, lastname, jobtitlename} = node;
        if(nodeType != 'resource'){
            return (
                <div className="am-tree-line">
                    <span className="am-tree-filling" style={{ width: (14 * lv) + 24 }} />
                    {nodeType === 'group' && !haschild ? null : (<span className="am-tree-icon"><Icon type={icon} /></span>)}
                    <span className="am-tree-title">{name}</span>
                </div>
            )
        }else{
            return (
                <div className="resource-leaf" onClick={() => {this.props.history.push(`/resourceInfo/${id}`)}}>
                    <div style={{display: 'flex'}} onClick={() => {this.props.history.push(`/resourceInfo/${id}`)}}>
                        <div style={{marginRight: 10}}>
                            <Avatar userId={id} />
                        </div>
                        <div style={{flex: 1}}>
                            <div style={{width: '100%', display: 'flex'}}>
                                <div style={{flex: 1, paddingRight: '10px'}}>
                                    <div className='text-elli'>{lastname}</div>
                                </div>
                                <div style={{flex: 1, paddingRight: '10px', color:"#bcbcbc"}}>
                                    <div className='text-elli'>{jobtitlename}</div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            )
        }
    }
}
